<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="./assert/mui/css/mui.css">
    <link rel="stylesheet" href="./assert/mui/css/icons-extra.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/searchList.css">
</head>

<body>
    <div class="wrap">
        <header>
            <a href="javascript:history.back();" class="mui-icon mui-icon-back"></a>
            <span>搜索中心</span>
            <a href="javascript:;" style="width:.48rem;height:.48rem;"></a>
        </header>
        <section>
            <div class="sec_cont  mui-scroll-wrapper" id="refreshContainer">
                <div class="mui-scroll">
                    <div class="search-wrap">
                        <div class="inner-wrap">
                            <input type="text" placeholder="搜索你喜欢的商品">
                            <a href="javascript:;" id="searchBtn">搜索</a>
                        </div>
                    </div>
                    <div class="order-nav">
                        <a class="order-btn" href="javascript:;" data-order="time">
                            <span>上架时间</span>
                            <span class="mui-icon mui-icon-arrowdown"></span>
                        </a>
                        <a class="order-btn" href="javascript:;" data-order="price">
                            <span>价格</span>
                            <span class="mui-icon mui-icon-arrowdown"></span>
                        </a>
                        <a class="order-btn" href="javascript:;" data-order="num">
                            <span>销量</span>
                            <span class="mui-icon mui-icon-arrowdown"></span>
                        </a>
                        <a class="order-btn" href="javascript:;" data-order="sale">
                            <span>折扣</span>
                            <span class="mui-icon mui-icon-arrowdown"></span>
                        </a>
                    </div>

                    <div id="product_box" class="mui-clearfix">
                        <!-- <a href="product.html?productId=1" class="cz_product">
                            <div class="box">
                                <img src="/mobile/images/product.jpg" alt="匡威三星标1970s converse复刻 142334c 144757c三星标黑色高帮">
                                <p class="name">匡威三星标1970s converse复刻 142334c 144757c三星标黑色高帮</p>
                                <p><span class="price">¥499.1</span><span class="oldPrice">¥888.1</span></p>
                                <button class="button">立即购买</button>
                            </div>
                        </a>
                    -->

                    </div>
                </div>
            </div>
        </section>
        <footer>
            <a href="javascript:;" class="active">
                <span class="mui-icon mui-icon-home "></span><span>首页</span>
            </a>
            <a href="javascript:;">
                <span class="mui-icon mui-icon-bars "></span><span>分类</span>
            </a>
            <a href="javascript:;">
                <span class="mui-icon-extra mui-icon-extra-cart"></span><span>购物车</span>
            </a>
            <a href="javascript:;">
                <span class="mui-icon mui-icon-person"></span><span>会员中心</span>
            </a>
        </footer>
    </div>

    <script id="listTemp" type="text/html">
        {{each data as item}}
        <a href="product.html" class="cz_product">
            <div class="box">
                <img src="{{item.pic[0].picAddr}}" alt="匡威三星标1970s converse复刻 142334c 144757c三星标黑色高帮">
                <p class="name">{{item.proName}}</p>
                <p><span class="price" style="color:red;">￥{{item.price}}</span><span class="oldPrice">￥{{item.oldPrice}}</span></p>
                <button class="button">立即购买</button>
            </div>
        </a>
        {{/each}}
    </script>

    <script src="./js/rem.js"></script>
    <script src="./assert/zepto/zepto.min.js"></script>
    <script src="./assert/mui/js/mui.js"></script>
    <script src="./js/util/util.js"></script>
    <script src="./assert/artTemplate/template.js"></script>
    <script src="./js/util/helper.js"></script>
    <script src="./js/searchList.js"></script>
</body>

</html>